<? $this -> load -> view('header');?>
<script type="text/javascript" src="/script/jscolor.js"></script>
<script language="JavaScript">
	$(document).ready(function() {
		$('#editview').hide();
		getData();
	});
	function editLand(id){
		if(id=="0"){
			$('#land_type_id').attr('disabled', '');
			$('#add_button').toggle();
			$('#editview').toggle("slow");
			$('#land_type_id').val("0");
				$('#land_type_name').val("");
			$('#description').val("");
		}else{
			$('#land_type_id').removeAttr('disabled');
		}
	}
	function detete(landTypeID){
		$.post("<?=$current_module?>/delete", { landtypeid: landTypeID},
		function(data) {
			alert( "Delete Complete");
			getData();
		});
	}
	function getDataByID(typeID){
		$('#content_list').html("");
		$.getJSON("<?=$current_module?>/getdataByID",{ landtypeid:typeID}, function(data){
			//$('#content_list').html(data);
			//alert(data);
			// var tmp = data.split("gis001");
			// $('#land_type_id').val(tmp[0]);
			// $('#land_type_name').val(tmp[1]);
			// $('#description').val(tmp[2]);
			$('#land_type_id').val(data.landtypeid);
			$('#land_type_name').val(data.name);
			$('#description').val(data.description);
			$('#color_map').val(data.hexcolor);
			
			$('#land_type_id').attr('disabled', '');
			$('#add_button').toggle();
			$('#editview').toggle("slow");
		});
	}
	
	function getData(){
		$('#content_list').html("");
		$.get("<?=$current_module?>/getdata", function(data){
			$('#content_list').html(data);
		});
	}
	function saveData(){
		$.post("<?=$current_module?>/update", { landtypeid: $('#land_type_id').val(), name:$('#land_type_name').val(),description:$('#description').val(),color_map:$('#color_map').val() },
			function(data) {
				alert( data);
				$('#add_button').toggle();
				$('#editview').toggle("slow");
				$('#land_type_id').val("0");
				$('#land_type_name').val("");
				$('#color_map').val("ffffcc") 
				$('#description').val("");
				getData();
			}
		);
	}
	function back(){
		$('#add_button').toggle();
				$('#editview').toggle("slow");
					getData();
	}
	
</script>
<div id="middle">
	<? $this -> load -> view('land/left_menu');?>
	<div id="center-column">
		<div class="top-bar">
			<a   id="add_button"  href="javascript:editLand('0','','');" class="button">Add Land Type </a>
			<h1>ประเภทพื้นที่เพาะปลูก</h1>
			<div class="breadcrumbs">
				<a href="#">Homepage</a> / <a href="#">Contents</a>
			</div>
		</div>
		<div class="table">
			<table width="100%"  id="editview" class="listing form" cellpadding="0" cellspacing="0">
				<tr style="display: none;">
					<td width="20%">LandTypeID:</td>
					<td>
					<input type="text" id="land_type_id"  value="0"/>
					</td>
				</tr>
				<tr>
					<th class="full" colspan="2">เพิ่ม/แก้ไข ประเภทพื้นที่เพาะปลูก</th>
							</tr>
				<tr >
					<td>LandTypeName:</td>
					<td>
					<input type="text" id="land_type_name" />
					</td>
				</tr>
				<tr >
					<td>Description:</td>
					<td>					<textarea id="description" cols="50" rows="4"></textarea></td>
				</tr>
				<tr>
								<td>เลือกสีที่แสดงในแผนที่:</td>
								<td><input id="color_map" class="color"></td>
							</tr>
				<tr>
					<td colspan="2" style="text-align: center;">
						
						
						<input type="button" value="Save" onclick="saveData();" />
						<input type="button" value="Back" onclick="back();" />
					</td>
				</tr>
			</table>
			</div>
			<br />
			<br />
			<div id="content_list"></div>
		
			
		</div>
	

	<div id="right-column">
		<strong class="h">Quick Info</strong>
		<div class="box">
			This is your admin home page. It will give you access to all things within the back end system that you will need to facilitate a smooth operation.
		</div>
	</div>
</div>
<? $this -> load -> view('footer');?>